<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- vue样式 -->
    <link rel="stylesheet" href="./css/vue.css">
    <!-- vue js -->
    <script src="./js/vue.js"></script>
    <!-- 路由 -->
    <script src="./js/vue-router.js"></script>
    <!-- element-plus js -->
    <script src="./js/element-plus.js"></script>
    <!-- icon -->
    <script src="./js/element-plus-icon.js"></script>
    <!-- 数据库 indexeddb -->
    <script src="./js/dexie.js"></script>
    <!-- 自定义的样式 -->
    <link rel="stylesheet" href="./css/main.css">
    <link rel="stylesheet" href="./css/common.css">
    <!-- aggrid -->
     <link rel="stylesheet" href="./css/ag-theme-alphine.css">
     <script src="./js/ag-grid-community.js"></script>
</head>

<body>

    <div id="app">


        <div>

            <header class="flexcc">
                <h1>银河电脑YHDN ERP SYSTEM</h1>
            </header>

        </div>
        <div class="grid250-1fr">

            <aside>

                <div>基础信息</div>
                <ul>

                    <li><router-link :to="{path:'/product',state:{title:'hello vue'}}" >产品信息录入</router-link></li>
                    <li><router-link to="/customer">客户信息录入</router-link></li>
                </ul>
                <div>出库入库</div>
                <ul>

                    <li><router-link :to="{path:'/addproduct'}">产品出库</router-link></li>
                    <li><router-link to="/customer">产品入库</router-link></li>
                </ul>
                <div>系统配置</div>
                <ul>

                    <li><router-link to="/aggrid">Aggrid测试</router-link></li>
                    <li><router-link to="/customer">产品入库</router-link></li>
                </ul>

            </aside>
            <main>

                <router-view>

                </router-view>

            </main>

        </div>



    </div>


    <script src="./js/product.js"></script>
    <script src="./js/customer.js"></script>
    <script src="./js/home.js"></script>
    <script src="./js/aggrid.js"></script>
    <script src="./js/addproduct.js"></script>
    <script src="./js/myrouter.js"></script>

    <script>



        


        // 根组件
        const app = Vue.createApp({
            components: {
                Product,
                Customer,
                Home,
                Aggrid,
                AddProduct
            },

            //引入路由组件
            setup() {

                const route = useRoute()
                message = Vue.ref('这是根组件')
                return {

                    message
                }
            }
        });


        //elementplus icon组件
        app.use(ElementPlus)
        for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
            app.component(key, component)
        }

        app.use(router)
        app.mount('#app');



    </script>

</body>

</html>